<template>
  <div class="box-centent">
    <div class="nav-box">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: 'project' }">创客集市</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: 'project' }">成果展示</el-breadcrumb-item>
        <el-breadcrumb-item>正文</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="text-box">
      <div class="title-box">
        <div class="title">基于物联网的红绿灯自动控制系统</div>
        <div>发布时间:&nbsp;&nbsp;&nbsp;&nbsp;2020-06-02</div>
      </div>
      <div class="text-content">
        <div class="msg">
          城市智能交通中，有些城市的红绿灯装有信号控制系统，在所有道路资源都充分使用的条件下红绿灯的转换频率只能按时间分配，不可能让路上的车辆变少，不能合理的红绿灯配时让道路的通行率大大降低，同时会延长机动车和行人等候通行的时间降低了交通通行效率。对于当前出现的上述问题，科缔欧智能红绿灯自动控制系统采用科缔欧智能人员监测分析摄像机，可以实时监测行人数量来智能转换红绿灯…
        </div>
        <div class="msg">
          城市智能交通中，有些城市的红绿灯装有信号控制系统，在所有道路资源都充分使用的条件下红绿灯的转换频率只能按时间分配，不可能让路上的车辆变少，不能合理的红绿灯配时让道路的通行率大大降低，同时会延长机动车和行人等候通行的时间降低了交通通行效率。对于当前出现的上述问题，科缔欧智能红绿灯自动控制系统采用科缔欧智能人员监测分析摄像机，可以实时监测行人数量来智能转换红绿灯…
        </div>
        <el-image style="width: 1128px; height: 360px; margin-top:23px" :src="url"></el-image>
        <div class="msg">
          城市智能交通中，有些城市的红绿灯装有信号控制系统，在所有道路资源都充分使用的条件下红绿灯的转换频率只能按时间分配，不可能让路上的车辆变少，不能合理的红绿灯配时让道路的通行率大大降低，同时会延长机动车和行人等候通行的时间降低了交通通行效率。对于当前出现的上述问题，科缔欧智能红绿灯自动控制系统采用科缔欧智能人员监测分析摄像机，可以实时监测行人数量来智能转换红绿灯…
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      fits: ['fill', 'contain', 'cover', 'none', 'scale-down'],
      url:
        'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
      activeName: 'first'
    }
  }
}
</script>

<style lang="scss" scoped>
.nav-box {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 18px 0;
  /deep/.el-breadcrumb {
    flex: 1;
  }
  .nav-search {
    display: flex;
    align-items: center;
    /deep/ .el-input {
      width: 85%;
      .el-input__inner {
        border-radius: 12px;
        height: 21px;
        line-height: 21px;
        padding-left: 15px;
        background: #f5f7ff;
      }
    }
    /deep/ .el-input__prefix {
      left: 115px;
      .el-icon-search {
        line-height: 21px;
      }
    }
  }
}
.text-box {
  padding: 24px 36px 71px 24px;
  margin-bottom: 72px;
  background: #fff;
  .title-box {
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: rgba(104, 115, 136, 1);
    border-bottom: 1px dashed #979797;
    padding-bottom: 28px;
    .title {
      font-size: 20px;
      color: rgba(6, 17, 37, 1);
      font-weight: 600;
      margin-bottom: 12px;
    }
  }
  .text-content {
    font-size: 16px;
    color: rgba(51, 69, 102, 1);
    line-height: 30px;
    .msg{
        margin-top: 23px;
    }
  }
}
</style>
